﻿@{
    Layout = null;
}
<table>
    <tr>
        <td style="width: 80px;">
            <label style="color: #ff0000; font-size: 1.2em;">Цвета</label></td>
        <td data-bind="foreach: colors">
            <div class="preview-read color-userui" data-bind="style: { backgroundColor: 'rgb(' + $data.RgbNumber + ')' }, attr: { title: Name }"></div>
        </td>
    </tr>
    <tr style="height: 30px;"></tr>
    <tr>
        <td style="width: 80px;">
            <label style="font-size: 1.2em;">Размеры</label></td>
        <td data-bind="foreach: sizes">
            <!-- ko if: size.Exist -->
            <div class="button-size button-size-style" title="Выбрать размер" data-bind="css: { 'button-size-selected': selected() }, text: size.Value, click: select"></div>
            <!-- /ko -->
            <!-- ko if: !size.Exist -->
            <a data-toggle="modal" href="#notifyModal" data-bind="click: function () { $root.setNotifySize(size.Value) }">
                <div class="button-size button-size-style" style="color: #ddd;" data-bind="text: size.Value" title="Нет в наличии"></div>
            </a>
            <!-- /ko -->
        </td>
    </tr>
    <tr>
        <td colspan="2"></td>
    </tr>
</table>
